import ElImageViewer from '@/components/ElImageViewer/index.vue'
import readFileSizeUnit from './mix/readFileSizeUnit/index.js'
export default {
  components: { ElImageViewer },
  mixins: [readFileSizeUnit],
  props: {
    value: {
      type: [Array, String],
      default() {
        return []
      }
    },
    fileSize: {
      type: Number,
      default: 1
    },
    ishowButton: {
      type: Boolean,
      default: true
    },
    size: {
      type: Number,
      default: 60
    }
  },
  data() {
    var token = this.$store.state.user.token
    return {
      headers: {
        token
      },
      token,
      fileList: [],
      action: this.$store.state.app.upload_url_file
    }
  },
  watch: {
    value: {
      handler(newVal) {
        this.fileList = newVal
        if (Array.isArray(newVal) && newVal.length > 0) {
          this.imageUrl = newVal[0].url
        } else {
          this.imageUrl = ''
        }
      },
      immediate: true,
      deep: true
    }
  },
  methods: {
    handleDel(index) {
      this.fileList.splice(index, 1)
    },
    handleError(err) {
      const msg = JSON.stringify(err)
      if (msg.toLowerCase().includes('401') || msg.toLowerCase().includes('invalid_token')) {
        this.$router.push('/login')
      }
    },
    beforeUpload(file) {
      const isLt2M = file.size / 1024 / 1024 < this.fileSize
      if (!isLt2M) {
        this.$message.error(`上传文件大小不能超过 ${this.fileSize}MB!`)
        return false
      } else {
        return true
      }
    }
  }
}
